<!--
 * @Author: error: error: git config user.name & please set dead value or install git && error: git config user.email & please set dead value or install git & please set dead value or install git
 * @Date: 2023-04-10 10:19:35
 * @LastEditors: error: error: git config user.name & please set dead value or install git && error: git config user.email & please set dead value or install git & please set dead value or install git
 * @LastEditTime: 2023-04-10 15:39:57
 * @FilePath: \dong2\dong2\src\components\header.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
	<div class="con">
		<div class="header-wrap">
			<el-menu :default-active="activeIndex" class="header computerNav" background-color="#CDCDCD" mode="horizontal"
				text-color="#42426F" active-text-color="#00009C">
				<el-menu-item index="1"><router-link :to="{ name: 'index' }" tag="div">首页</router-link></el-menu-item>
				<el-submenu index="2">
					<template slot="title">
						东巴文
					</template>
					<el-menu-item index="2-1">东巴文</el-menu-item>
					<el-menu-item index="2-2">东巴</el-menu-item>
					<el-menu-item index="2-3">东巴</el-menu-item>
				</el-submenu>
				<el-submenu index="3">
					<template slot="title">
						人工智能
					</template>
					<el-menu-item index="3-1">重要通知</el-menu-item>
					<el-menu-item index="3-2">要闻</el-menu-item>
					<el-menu-item index="3-3">重要通知</el-menu-item>
				</el-submenu>
				<el-submenu index="4">
					<template slot="title">
						睿抗
					</template>
					<el-menu-item index="4-1">活动预告</el-menu-item>
					<el-menu-item index="4-2">精彩活动回顾</el-menu-item>
				</el-submenu>
				<el-menu-item index="5"><router-link :to="{ name: 'home' }" tag="div">检索</router-link></el-menu-item>
				<el-menu-item index="6">资料下载</el-menu-item>
				<el-submenu index="7">
					<template slot="title">
						反馈
					</template>
					<el-menu-item index="7-1">
						<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=2804774882&site=qq&menu=yes">
							<img border="0" src="http://wpa.qq.com/pa?p=2:2804774882:51" alt="点击这里给我发消息" title="QQ交流" />
						</a>
					</el-menu-item>
					<el-menu-item index="7-2">
						<a target="_blank"
							href="http://mail.qq.com/cgi-bin/qm_share?t=qm_mailme&email=d0VPR0NAQENPT0U3BgZZFBga"
							style="text-decoration:none;">
							<img
								src="http://rescdn.qqmail.com/zh_CN/htmledition/images/function/qm_open/ico_mailme_02.png" />
						</a>
					</el-menu-item>
				</el-submenu>
				<div class="btns">
					<el-button>
						<router-link :to="{ name: 'home' }" tag="div">
							开始检索 <i class="el-icon-d-arrow-right"></i>
						</router-link>
					</el-button>
					<el-button class="rightMenu" round v-if="!isLogin">
						<router-link :to="{ name: 'login' }" tag="div">登录</router-link>
					</el-button>
					<el-button class="rightMenu" round v-else @click="clear">
						<!-- <router-link :to="{ name: 'login' }" tag="div">退出登录</router-link> -->
						退出登录
					</el-button>
				</div>
			</el-menu>
		</div>
	</div>
</template>
<script>
export default {
	name: 'myHeader',
	data() {
		return {
			activeIndex: '1',
			isLogin:false,
		}
	},
	mounted(){
		console.log(this.$cookie.get('cookie'))
		if(this.$cookie.get('cookie')){
			this.isLogin = true
		}else {
			this.isLogin = false
		}
	},
	methods: {
		clear(){
				this.$router.push('/login')
				this.isLogin = false
				this.$cookie.remove('cookie')
		}
	}
}
</script>
<style lang="scss" scoped>
.header-wrap {
	background-color: #cdcdcd;
	// position: fixed;
	left: 0;
	right: 0;
	top: 0;
	height: 70px;
	text-align: center;
}

.con {
	height: 65px;
}

.phone-nav {
	display: none;
}

.header {
	width: 1024px;
	height: 70px;
	line-height: 70px;
	margin: 0 auto;
}

.el-menu.el-menu--horizontal a {
	color: #fff;
}

a {
	text-decoration: none;
	color: #eee;
	font-size: 16px;
}
</style>